<template>
	<view>
		<!-- 	<u-upload accept="file"  @afterRead="afterRead" name="1" multiple :maxCount="maxCount" maxSize="10*1024*1024">
			<slot></slot>
		</u-upload> -->
		<view class="add-file" :class="[fileLength>0?'add-file-small':'']" @click="handleFile">
			<view style="font-size: 40rpx;">+</view>添加附件
		</view>
	</view>
</template>

<script>
	import config from '@/common/config';
	export default {
		props: {
			maxCount: {
				type: Number,
				default () {
					return 9;
				}
			},
			fileType: {
				type: Number,
				default () {
					return 3;
				}
			},
			fileLength: {
				type: Number,
				default () {
					return 0;
				}
			}
		},
		data() {
			return {
				fileList1: [],
			}
		},
		onLoad() {

		},
		methods: {
			//选择文件  1.微信 2.企业微信  3.钉钉
			handleFile() {
				if (this.fileLength >= this.maxCount) {
					uni.$u.toast(`最大限制上传${this.maxCount}个`)
					return
				}
				const that = this
				const sinfo = uni.getSystemInfoSync();
				if (sinfo.environment && sinfo.environment == 'wxwork') {
					//这里是微信
					wx.qy.chooseMessageFile({
						count: 1, //能选择文件的数量
						type: 'file', //能选择文件的类型,我这里只允许上传文件.还有视频,图片,或者都可以
						async success(res) {
							var size = res.tempFiles[0].size;
							var filename = res.tempFiles[0].name;
							var newfilename = filename + "";
							console.log('res.tempFiles[0].path', res)
							var hz = filename.substring(filename.length - 3, filename.length)
							if (hz == 'txt') {
								wx.showToast({
									title: '无法上传txt文件',
									icon: "none",
									duration: 2000,
									mask: true
								})
							} else if (hz == 'png') {
								wx.showToast({
									title: '无法上传png文件',
									icon: "none",
									duration: 2000,
									mask: true
								})
							} else if (hz == 'mp4') {
								wx.showToast({
									title: '无法上传mp4文件',
									icon: "none",
									duration: 2000,
									mask: true
								})
							} else if (size > 20 * 1024 * 1024) { //我还限制了文件的大小和具体文件类型
								wx.showToast({
									title: '文件大小不能超过20MB',
									icon: "none",
									duration: 2000,
									mask: true
								})
							} else {
								let result = ''
								result = await that.uploadFilePromise(res.tempFiles[0].path, filename)
								let obj = {
									...res.tempFiles[0],
									url: result.data.fileIds[0],
									message: "上传中",
									status: "uploading"
								}
								obj.size = Math.floor(obj.size / 1024)
								that.$emit("getdata", obj)
							}
						}
					})
				} else if (sinfo.app && sinfo.app == 'DingTalk') {
					uni.navigateTo({
						url: '/pages/subPackagesD/uploadFile/uploadFile?token=' + encodeURIComponent(uni
							.getStorageSync('userInfo').token)
					})
				} else {
					//这里是微信
					wx.chooseMessageFile({
						count: 1, //能选择文件的数量
						type: 'file', //能选择文件的类型,我这里只允许上传文件.还有视频,图片,或者都可以
						async success(res) {
							var size = res.tempFiles[0].size;
							var filename = res.tempFiles[0].name;
							var newfilename = filename + "";
							console.log('res.tempFiles[0].path', res)
							var hz = filename.substring(filename.length - 3, filename.length)
							if (hz == 'txt') {
								wx.showToast({
									title: '无法上传txt文件',
									icon: "none",
									duration: 2000,
									mask: true
								})
							} else if (size > 20 * 1024 * 1024) { //我还限制了文件的大小和具体文件类型
								wx.showToast({
									title: '文件大小不能超过20MB',
									icon: "none",
									duration: 2000,
									mask: true
								})
							} else {
								let result = ''
								result = await that.uploadFilePromise(res
									.tempFiles[0].path, filename)
								let obj = {
									...res.tempFiles[0],
									url: result.data.fileIds[0],
									message: "上传中",
									status: "uploading"
								}
								obj.size = Math.floor(obj.size / 1024)
								that.$emit("getdata", obj)
							}
						}
					})
				}

			},

			// 读取文件后
			async afterRead(event) {
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file)
				console.log('event===>', event)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				let result = ''
				for (let i = 0; i < lists.length; i++) {
					result = await this.uploadFilePromise(lists[i].url, lists[i].name)
					console.log('result===>', result)
				}
				this.fileList1[this.fileList1.length - 1].url = result.data.fileIds[0]
				console.log('上传文件集合===>', this.fileList1, this.fileType)
				this.$emit("getdata", this.fileList1)
			},
			uploadFilePromise(url, fileName) {
				uni.showLoading({
					title: '文件上传中...',
					mask: true
				});
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: config.baseUrl + '/base/upload/uploadFile',
						filePath: url,
						timeout: 300000, //5分钟
						name: 'file',
						formData: {
							type: this.fileType,
							file: url
						},
						header: {
							// #ifdef MP
							"Content-Type": "multipart/form-data",
							// #endif
							"API-User-Token": uni.getStorageSync('userInfo')
								.token
						},
						success: (uploadFileRes) => {


							let res = JSON.parse(uploadFileRes.data);
							setTimeout(() => {
								resolve(res)
								// 关闭加载中
								uni.hideLoading()
							}, 500)
						},
						fail: res => {
							// 关闭加载中
							uni.hideLoading()
						}
					});
				})
			},

		}
	}
</script>

<style lang="scss">
	.add-file {
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 12rpx;
		border: 1px solid #0F53AC;
		margin-top: 30rpx;
		padding: 20rpx 0;
		color: #0F53AC;
		width: 680rpx;
	}
	.add-file-small{
		margin-top: 28rpx;
	}
</style>
